<template>
  <div class="get-log">
    <div class="row">
      <el-radio-group v-model="container" class="radio-group">
        <el-radio label="lh-web">lh-web</el-radio>
        <el-radio label="lh-message">lh-message</el-radio>
        <el-radio label="lh-admin">lh-admin</el-radio>
        <el-radio label="lh-user">lh-user</el-radio>
        <el-radio label="lh-trade">lh-trade</el-radio>
      </el-radio-group>
    </div>
    <div class="row">
      <el-input
          v-model="grepContent"
          placeholder="输入正则，不填默认全查"
      ></el-input>
    </div>
    <div class="row">
      <el-radio-group v-model="grepLine" class="radio-group">
<!--        <el-radio label="no_grep">不定位</el-radio>-->
        <el-radio label="1">查询一行</el-radio>
        <el-radio label="100">查询上下100行</el-radio>
        <el-radio label="last_500">查询最后500行</el-radio>
      </el-radio-group>
    </div>
    <div class="row">
      <el-checkbox v-model="scroll" class="radio-group">是否滚动查询</el-checkbox>
    </div>
    <div class="row">
<!--      <el-button type="primary" @click="handleConfirm">确认</el-button>-->
      <el-button type="primary" class="action-button" size="mini" :loading="outputRunning" @click="handleConfirm">确认</el-button>
      <el-button type="danger" class="action-button" size="mini" @click="stopPing">停止</el-button>
    </div>
<!--    这里加入console的组件-->
    <div class="row">
      <output-console class="output-console" ref="outputConsole"></output-console>
    </div>
  </div>
</template>

<script>
import OutputConsole from "@/views/OutputConsole";

export default {
  data() {
    return {
      container: 'lh-web',
      grepContent: '',
      grepLine: 'last_500',
      scroll:true,
      outputRunning: false
    };
  },
  components: {
    OutputConsole,
  },
  methods: {
    async handleConfirm() {
      this.outputRunning = true;
      this.$refs.outputConsole.clearOutPut();
      let k8sContainerName=await window.electronAPI.connectToRemoteHost(`kubectl get pods -n loveher | grep "${this.container}" | awk '{print $1}' | head -1`,true)
      //去除空格
      k8sContainerName=k8sContainerName.replace(/\s/g, "");
      let option=true===this.scroll? '-f ' : ''
      option+='last_500'===this.grepLine? ' --tail=500' : ''
      let grepOption=''
      if ('' !== this.grepContent){
        switch (this.grepLine){
          case '1','100':
            grepOption=`| grep -C ${this.grepLine} "${this.grepContent}"`
            break
          default:
            grepOption=`| grep "${this.grepContent}"`
            break
        }
      }
      let bash=`kubectl logs ${option} ${k8sContainerName} -n loveher ${grepOption}`
      this.$refs.outputConsole.addToOutput(bash);
      console.log(bash)
      await window.electronAPI.connectToRemoteHost(bash,false)
      this.outputRunning = false;
    },
    stopPing(){
      this.outputRunning = false;
      window.electronAPI.stopOnListenMainRemoteStream();
    }
  }
};
</script>

<style scoped>
.get-log {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 20px;
}

.row {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.output-console {
  margin-left: 60px;
  text-align: center;
}

.radio-group {
  display: flex;
  flex-direction: row;
}
</style>
